﻿@{
    ViewBag.Title = "Title information";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

    @{
        int userId = 0;
        if (User != null)
        {
            userId = User.UserId;
        }

        <div id="PresentationBoxWithFloatingHeader" ng-app="publicModule" ng-controller="TitleController" ng-init="init('@ViewBag.titleId', '@userId')">

            <div class="floatingHeader">
                <h1 id="PresentationTitle">{{title.Title.BookTitle}}</h1>
            </div>

            @if (DoeLibsMVC.Security.SecurityHelper.currentUserIsInStaffGroup())
            {
                <button type="button" class="generalBtn" data-toggle="modal" data-target="#addLoanableBasicModal">
                    add loanable
                </button>
            }
            <div id="AngularTables">
                <table class="DataPresentationtable">
                    <thead>
                        <tr>
                            <th>Status</th>
                            <th>DoeLibS-ID</th>
                            <th>Owner</th>
                            <th>Room</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="loanable in title.Loanables">
                            <td ng-switch="getStatusForLoanable(loanable.LoanableId)">
                                <span ng-switch-when="0">Available (reserved for you)</span>
                                <span ng-switch-when="1">Reserved</span>
                                <span ng-switch-when="2">Available</span>
                                <span ng-switch-when="3">Borrowed</span>
                                <span ng-switch-when="4">Unavailable</span>
                                <span ng-switch-when="5">Recalled</span>
                                <span ng-switch-default>Unknown</span>
                            </td>
                            <td>{{loanable.Barcode}}</td>
                            <td>{{loanable.Owner.FirstName}} {{loanable.Owner.LastName}}</td>
                            <td>{{loanable.Location}} ({{loanable.Category.Name}})</td>

                            <td ng-if="!currentUserIsOwnerOfLoanable(loanable.LoanableId) && !userIsOwnerOfAtLeastOneLoanable()" ng-switch="getStatusForLoanable(loanable.LoanableId)">
                                <span ng-switch-when="0">
                                    <!-- loanable is reserved for user -->
                                    <input type="button" value="check out" class="checkInOutBtn" ng-click="checkOutLoanable(loanable.LoanableId);" />
                                </span>
                                <span ng-switch-when="1">
                                    <!-- loanable is reserved for other users -->
                                </span>
                                <span ng-switch-when="2">
                                    <!-- loanable is available -->
                                    <input type="button" value="check out" class="checkInOutBtn" ng-click="checkOutLoanable(loanable.LoanableId);" ng-if="userId > 0 && !user.IsPendingExpiration && usersLoansForThisTitle.length == 0" />

                                </span>
                                <span ng-switch-when="3">
                                    <!-- loanable is borrowed ==> check if user is borrower -->
                                    <input type="button" value="check in" class="checkInOutBtn" ng-click="checkInLoanable(loanable.LoanableId);" ng-if="userHasBorrowedLoanable(loanable.LoanableId)" />
                                </span>
                                <span ng-switch-when="4">
                                    <!-- loanable is unavailable -->
                                </span>
                                <span ng-switch-when="5">
                                    <!-- loanable is recalled ==> check if user is borrower -->
                                    <input type="button" value="check in" class="checkInOutBtn" ng-click="checkInLoanable(loanable.LoanableId);" ng-if="userHasBorrowedLoanable(loanable.LoanableId)" />
                                </span>
                            </td>
                            <td ng-if="!currentUserIsOwnerOfLoanable(loanable.LoanableId) && userIsOwnerOfAtLeastOneLoanable()">
                                <!-- owner of a loanable of this title cannot checkout any other loanable -->
                            </td>
                            <td ng-if="currentUserIsOwnerOfLoanable(loanable.LoanableId)" ng-switch="getStatusForLoanable(loanable.LoanableId)">

                                <span ng-switch-when="1">
                                    <!-- loanable is reserved -> show only button to "mark as unavailable" -->
                                    <input type="button" value="make unavailable" class="checkInOutBtn" ng-click="markAsUnavailable(loanable.LoanableId);" />
                                </span>
                                <span ng-switch-when="2">
                                    <!-- loanable is available -> show only button to "mark as unavailable" -->
                                    <input type="button" value="make unavailable" class="checkInOutBtn" ng-click="markAsUnavailable(loanable.LoanableId);" />
									<input type="button" value="remove" class="checkInOutBtn" ng-click="removeLoanable(loanable.LoanableId);" />
                                </span>
                                <span ng-switch-when="4">
                                    <!-- loanable is unavailable cause of recal -> show button to "mark as available again" -->
                                    <input type="button" value="make available again" class="checkInOutBtn" ng-click="markAsAvailable(loanable.LoanableId);" ng-if="!user.IsPendingExpiration"/>
									<input type="button" value="remove" class="checkInOutBtn" ng-click="removeLoanable(loanable.LoanableId);" />
                                </span>
                                <span ng-switch-when="5">
                                    <!-- loanable is unavailable cause of recal -> owner can only wait -->
                                </span>
                                <span ng-switch-default>
                                    <!-- loanable is borrowed/reserved/... -> show button to "recall"-->
                                    <input type="button" value="recall" class="checkInOutBtn" ng-click="recallLoanable(loanable.LoanableId);" ng-if="!loanable.UnavailableFromOwner" />
                                </span>
                            </td>
                        </tr>
                    </tbody>
                </table>

                <br />

            

            @if (User != null)
            {
                <input type="button" value="reserve" class="generalBtn sideMargins10" ng-click="reserveTitle()" ng-if="!user.IsPendingExpiration && usersLoansForThisTitle.length == 0 && !userHasTitleReserved() && !userIsOwnerOfAtLeastOneLoanable()" id="reserveButton" />
                if (DoeLibsMVC.Security.SecurityHelper.currentUserIsInStaffGroup())
                {
                    <button type="button" class="generalBtn" data-toggle="modal" data-target="#editTitleModal">
                        edit
                    </button>
                }
            }

                <h2>Information</h2>
                <table class="AngularTable">
                    <tbody>

                        <tr>
                            <th>Title</th>
                            <td>{{title.Title.BookTitle}}</td>
                        </tr>
                        <tr>
                            <th>ISBN-13</th>
                            <td>{{title.Title.ISBN13}}</td>
                        </tr>
                        <tr>
                            <th>ISBN-10</th>
                            <td>{{title.Title.ISBN10}}</td>
                        </tr>
                        <tr>
                            <th>Edition</th>
                            <td>Version: {{title.Title.EditionNumber}}</td>
                        </tr>
                        <tr ng-if="title.Title.FirstEditionYear > 0">
                            <th>First edition year</th>
                            <td>{{title.Title.FirstEditionYear}}</td>
                        </tr>
                        <tr>
                            <th>Publisher</th>
                            <td>{{title.Title.Publisher.Name}} ({{title.Title.EditionYear}})</td>
                        </tr>
                        <tr>
                            <th>Authors</th>
                            <td>
                                <ul>
                                    <li ng-repeat="author in title.Authors"><a href="@Url.Action("Get", "Author")/{{author.Aid}}">{{author.Name}}</a></li>
                                    <li ng-repeat="editor in title.Editors"><a href="@Url.Action("Get", "Author")/{{editor.Aid}}">{{editor.Name}}(Editor)</a></li>
                                </ul>
                            </td>
                        </tr>
                        <tr>
                            <th>Topics</th>
                            <td>
                                <ul>
                                    <li ng-repeat="topic in title.Topics"><a href="@Url.Action("Get", "Topic")/{{topic.TopicId}}">{{topic.TopicName}}</a></li>
                                </ul>
                            </td>
                        </tr>
                    </tbody>
                </table>

               
            </div>
        </div>

    }



<!-- add modals -->
@if (DoeLibsMVC.Security.SecurityHelper.currentUserIsInStaffGroup())
{
    @Html.Action("Edit", "Title", new { id = ViewBag.titleId })
    
    @Html.Action("AddLoanable", "Title", new { id = ViewBag.titleId })
}